.ui-page {
	background:#fff;
}

.banner {
	text-align: center;
	line-height: 0
}

.banner .chat-start {
	/*margin-top: 1em*/
}

.banner img {
	width: 80%;
	margin: .3em auto
}

#info .logo {
	text-align: center;
	margin: .5em auto;
	width: 230px
}

.page-intro {
	text-align: center;
	position: fixed;
	bottom: 2%;
	width: 100%
}

.page-intro img {
	display: inline-block;
	height: 25px
}

.page-intro .coslogo {
	height: 20px
}

.page-intro span {
	color: #fff;
	font-weight: 100;
	font-size: .7em;
	text-shadow: 0 0;
	letter-spacing: .1em
}

#chat {
	background:#EBEBEB url('../img/no.png')  no-repeat center center;
	
}

#chat .chat-cell .person-photo {
	width: 40px;
	height: 40px;
	margin: 0
}

#chat .chat-cell .info-img {
	height: 40px
}

#chat .chat-content-left {
	background-color: #fff;
	border-radius: .2em;
	color: #403F3B
}

#chat .chat-content-left .voice-bar {
	height: 20px;
	min-width: 40px;
	border-left: 3px solid #ff8882
}

#chat .chat-content-left .voice-bar img {
	height: 100%;
	float: right
}

#chat .chat-content-right {
	background: #548AEA;
	color: #fff;
	border-radius: .2em
}

#chat .ui-footer {
	background: #fff;
	border: 0
}

#panel .end-btn {
	position: relative;
	overflow: hidden
}

#panel .end-btn div {
	display: inline-block
}

#panel .end-btn .restart-btn {
	float: right;
	width: 65%
}

@media (max-width:320px) {
	.end-btn .restart-btn {
		width: 58%
	}
}

#panel .chatbtn,#toggle {
	color: #fff;
	background: #548AEA;
	text-shadow: 0 0;
	border-radius: .2em
}

#toggle:active,#panel .chatbtn:active {
	background: #769fe8;
	color: #fff
}

#match-popup {
	position: fixed;
	left: 0;
	top: 0;
	background: #282242;
	opacity: .9;
	z-index: 9999;
	overflow: hidden
}

#match-container {
	position: fixed;
	overflow: hidden;
	top: 0;
	z-index: 9999;
	text-shadow: 0 0;
	text-align: center;
	width: 100%;
	height: 100%
}

#match-container .match-tit {
	font-size: 1.6em;
	color: #fff;
	font-weight: 500
}

#match-container .match-photos {
	margin: auto
}

#match-container .match-photos img {
	display: inline-block;
	width: 150px;
	border-radius: 50%;
	border: 2px solid #fff;
	margin-top: 90px;
	opacity: 1
}

#match-container .sk-three-bounce .sk-child {
	background-color: #fff
}

#match-container #chat-open {
	margin: 5em;
	width: 60px
}

.rotate-shack {
	animation: rotateshack .4s linear infinite
}

@keyframes rotateshack {
	0% {
		transform: rotate(15deg)
	}

	50% {
		transform: rotate(0deg)
	}

	100% {
		transform: rotate(15deg)
	}
}

#match-container .voice-play {
	width: 100%;
	margin-top: 50px
}

.huatianstamp {
	position: absolute;
	top: 0;
	right: 5px
}

.end-container .huatianstamp img {
	width: 80px
}

.chat-hint img {
	width: 200px;
	display: block;
	margin: 1em auto
}